<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.2</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <script type="text/javascript" src="../../common/js/public.js"></script>
    <script type="text/javascript" src="../../common/js/publicUtils.js"></script>
    <style>
        .buttondiv{
            display: none;
        }
        .layui-form-item{
            width: 700px;
        }
        .error{
            color: red;
            line-height: 20px;
        }

        input.error, select.error {
            background-color: #fbe2e2;
            border-color: #c66161;
            color: #c00;
        }

    </style>
</head>
<body>
<div class="layui-fluid" id="flowDiv" onload="onLoad()">
    <div class="menudiv">
        <form class="layui-form"  id="form" >

            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label"  style="width: 8%"> </label>
                <div class="layui-input-inline"  style="width: 35%">
                    <img id="image-preview" src="../../common/images/employee_default.png" style="width: 100px;height: 100px;float: left" alt="暂无照片">
                    <input id="btn" type="button" style="margin-top: 80px;float: left;margin-left: 10px" value="上传照片">
                    <input id="file" name="file"   style="display: none;"  onchange="fileUpload()" type="file">
                    <input id="orgId" name="orgId"   type="hidden">
                </div>
            </div>
            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label"  style="width: 8%"><span style="color: red;">*</span>登录名</label>
                <div class="layui-input-inline"  style="width: 35%">
                    <input id="loginName" name="loginName" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
                <label class="layui-form-label"  style="width: 8%"><span style="color: red;">*</span>姓　名</label>
                <div class="layui-input-inline"  style="width: 35%">
                    <input id="name" name="name" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
            </div>
            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%"><span style="color: red;">*</span>性　别</label>
                <div class="layui-input-inline" style="width: 35%">
                    <select id="sexy" name="sexy" class="layui-input">
                    </select>
                </div>
                <label class="layui-form-label" style="width: 8%"><span style="color: red;">*</span>职　位</label>
                <div class="layui-input-inline" style="width: 35%">
                    <select id="title" name="title" class="layui-input">
                    </select>
                </div>
            </div>

            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%"><span style="color: red;">*</span>类　型</label>
                <div class="layui-input-inline" style="width: 35%">
                    <select id="type" name="type" class="layui-input">
                    </select>
                </div>
                <label class="layui-form-label" style="width: 8%"><span style="color: red;">*</span>状　态</label>
                <div class="layui-input-inline" style="width: 35%">
                    <select id="state" name="state" class="layui-input">
                    </select>
                </div>
            </div>

            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%">身份证</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="idCard" name="idCard" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
                <label class="layui-form-label" style="width: 8%">电　话</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="phone" name="phone" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
            </div>
            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%">邮　箱</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="email" name="email" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
                <label class="layui-form-label" style="width: 8%"><span style="color: red;">*</span>排　序</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="sort" name="sort" lay-verify="required" autocomplete="off" class="layui-input" type="text">
                </div>
            </div>

            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%">所属组织</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="orgName" name="orgName" lay-verify="required" autocomplete="off" class="layui-input" type="text"  readonly="readonly">
                </div>
                <label class="layui-form-label" style="width: 8%">角　色</label>
                <div class="layui-input-inline" style="width: 35%">
                    <input id="roleName"  lay-verify="required" autocomplete="off" class="layui-input input_button" type="text">
                    <input id="roleId" name="roleId"   type="hidden">
                    <input type="button" value="选择" class="btn_self layui-btn layui-btn-primary layui-btn-small button_input" onclick="bingRole()">
                </div>

            </div>
            <div class="layui-form-item " style="width: 100%">
                <label class="layui-form-label" style="width: 8%">备　注</label>
                <div class="layui-input-inline" style="width: 84%">
                    <textarea id="comment" name="comment" style="width:226%" placeholder="请输入备注" class="layui-textarea"></textarea>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<SCRIPT type="text/javascript">

    var zTreeObj,zTreeObj_input,zTreeObj_input_button;
    var form;
    var orgId;

    $(function(){
        //隐藏原始文件上传样式
        $('#btn').click(function(){
            $('#file').click();
        });
        //初始化职位
        getPosition("UserPosition","title");
        //初始化性别
        getPosition("UserSex","sexy");
        //初始化类型
        getPosition("UserType","type");
        //初始化状态
        getPosition("UserState","state");
        orgId=getUrlParam("orgId");
        $("#orgName").val(getUrlParam("orgName"));
        $("#orgId").val(orgId);
    });

    //通过字典初始化
    function getPosition(code,id){
        publicAjax ("post","/infdictitem/selectInfdictitemByInfdictsortCode?code="+code,{},false,null,function (r) {
            var data=r.data;
            var html="";
            for(var i=0;i<data.length;i++){
                html+="<option value="+data[i].code+">"+data[i].name+"</option>";
            }
            $("#"+id).html(html);
        });
    }

    //不上传回显图片
    function fileUpload(){
        var fileImage = document.getElementById('file');
        // 清除历史图片:
        document.getElementById('image-preview').src = '';
        // 检查文件是否选择:
        if(!fileImage.value) {
            info.innerHTML = '没有选择文件';
            return;
        }
        // 获取File引用:
        var file = fileImage.files[0];
        //判断文件大小
        // var size = file.size;
        // if(size >= 1*1024*1024){
        //     alert('文件大于1兆不行!');
        //     return false;
        // }
        // 获取File信息:
        if(file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
            layer.msg("请选择图片格式");
            return;
        }
        // 读取文件:
        var reader = new FileReader();
        // 以DataURL的形式读取文件:
        reader.readAsDataURL(file);
        reader.onload = function(e) {
            document.getElementById('image-preview').src=this.result;
        };
    }




    layui.use(['form', 'layer'], function() {
        form = layui.form
            , layer = layui.layer;

    })

    function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return decodeURIComponent(r[2]);
        return null;
    }

    function bingRole(callback){
        var url='./bindrole.html';
        if(isEmpty(callback)){

            callback = function(index, layero) {
                var iframeWin = layero.find('iframe')[0];
                var result=iframeWin.contentWindow.submit(index, layero);
                if(!result){
                    return false;
                }
                layer.close(index);
            }
        }
        layer.open({
            type: 2,
            area: [1000 + 'px', 550 + 'px'],
            fix: false,
            //不固定
            shade: 0.3,
            title: "选择角色",
            content: url,
            btn: ['确定', '关闭'],
            // 弹层外区域关闭
            shadeClose: false,
            yes: callback,
            cancel: function(index) {
                return true;
            }
        });
    }

    /**
     * 保存菜单
     */
    function submit(index, layero,type){

        if($(validform().form())[0]){
            if($("#"))
            var formData = new FormData($("#form")[0]);
            var result;
            publicAjaxFormData(null,'orgPerson/insert',formData,false,null,function (r) {
                result=r;
            })
            if(type=='applye'){
                if(result.code==2000){
                    laysuccess("新增成功");
                }else{
                    layerror("新增失败");
                }
            }
            $("#name").val("");
            $("#fid").val("");
            $("#sort").val('');
            $("#comment").val('');
            return result;
        }
    }

    jQuery.validator.addMethod("hasLoginName",function(value,element){
        var data = {"loginName" : value};
        var codevurl= "orgPerson/hasOrgPerson";
        var obj = true;

        publicAjax ("post",codevurl,data,false,null,function (r) {
            if(r.code==2000){
                if(r.data>0){
                    obj = false;
                }else{
                    obj = true;
                }

            }else{
                obj = false;
            }
        });
        return obj;
    },"登录名已存在，请重新输入");

    jQuery.validator.addMethod("isPhone", function(value, element) {
        var length = value.length;
        var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;
        return this.optional(element) || (length == 11 && mobile.test(value));
    }, "请填写正确的手机号码");//可以自定义默认提示信息


    //编写表单验证函数validform，在验证按钮注册按钮点击事件内调用验证函数对象
    function validform(){

        return $("#form").validate({
            rules : {
                loginName :{
                    required:true,
                    hasLoginName:true
                },
                name : "required",
                // sexy : "required",
                // title : "required",
                // type : "required",
                // state : "required",
                sort: {
                    required:true,
                    number:true
                },
                comment: {
                    maxlength: 100
                },
                phone:{
                    minlength : 11,
                    isPhone : true
                },
                email:{
                    email:true
                }
            },
            messages : {
                loginName : {
                    required: "登录名不能为空",
                    hasLoginName:"登录名不能重复"
                },
                name : {
                    required: "名称不能为空"
                },
                sort : {
                    required:"请输入有效的数字",
                    number: "请输入有效的数字"
                },
                comment : {
                    maxlength: "备注长度不可超过100"
                },
                phone:{
                    minlength : "不能小于11个字符",
                    isMobile : "请正确填写手机号码"
                },
                email:{
                    email:"请填写正确的邮箱格式"
                }
            }
        });

    }

</SCRIPT>
</html>